import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'controller.dart';
import 'package:flutter/material.dart';

class LoginView extends GetView<LoginController> {
  LoginView({super.key});

  final GlobalKey<FormState> _formKey = GlobalKey();

  @override
  Widget build(BuildContext context) {
    Get.put(LoginController());

    return Scaffold(
      backgroundColor: Colors.white,
      body: ConstrainedBox(
        constraints: const BoxConstraints.expand(),
        child: Container(
          padding: const EdgeInsets.only(left: 40, right: 40),
          child: Form(
            key: _formKey,
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              children: [
                TextFormField(
                    autofocus: true,
                    decoration: InputDecoration(
                      labelText: 'username'.tr,
                      hintText: 'username'.tr,
                      prefixIcon: const Icon(Icons.person),
                    ),
                    controller: controller.usernameCtrl,
                    onChanged: controller.checkInput,
                    validator: (v) {
                      if (v == null || v.isEmpty) {
                        return '请输入用户名'.tr;
                      }
                    }),
                Obx(
                  () => TextFormField(
                    decoration: InputDecoration(
                      labelText: 'password'.tr,
                      prefixIcon: const Icon(Icons.lock),
                      suffixIcon: GestureDetector(
                        child: Icon(controller.passwordSuffixIcon),
                        onTap: () {
                          controller.showPassword.value =
                              !controller.showPassword.value;
                        },
                      ),
                    ),
                    obscureText: !controller.showPassword.value,
                    controller: controller.passwordCtrl,
                    onChanged: controller.checkInput,
                    validator: (v) {
                      if (v == null || v.isEmpty) {
                        return '请输入密码'.tr;
                      }
                      if (v.length < 6) {
                        return '请输入正确的密码'.tr;
                      }
                    },
                  ),
                ),
                SizedBox(
                  height: 20.h,
                ),
                Obx(
                  () => ElevatedButton(
                    onPressed: controller.canLogin.isTrue ? () {
                      if (_formKey.currentState!.validate()) {
                        controller.login();
                      }
                    } : null,
                    child: Container(
                      alignment: Alignment.center,
                      width: double.infinity,
                      child: Text("login".tr),
                    ),
                  ),
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}
